
<template>
	<!--  -->
	<div>
		<!-- 教学计划 -->
		<div>
			<el-row :gutter="10" style="margin-top:0.1rem;">
				<el-col :span="4">
					<el-select clearable style="width:100%;" v-model="searchParam.schoolYearId"></el-select>
				</el-col>
				<el-col :span="6">
					<weekPicker @callback="pickTime" v-model="selectWeekTime"></weekPicker>
				</el-col>
				<el-col :span="4">
					<el-input clearable placeholder="输入班级名称搜索" v-model="searchParam.className"></el-input>
				</el-col>
				<el-col :span="2">
					<el-button @click="search(1)">搜索</el-button>
				</el-col>
				<el-col :span="8" style="text-align:right;">
					<el-button @click="visiblePlanPopup(true)">添加计划</el-button>
				</el-col>
			</el-row>
			<el-row style="margin-top:0.1rem;">
				<table class="table" cellspacing="0">
					<thead class="thead">
						<tr>
							<td style="width: 4rem;">班级名称</td>
							<td style="width: 4rem;">计划类型</td>
							<td style="width: 4rem;">应用时间</td>
							<td style="width: 4rem;">制表时间</td>
							<td style="width: 4rem;">制表人</td>
							<!-- <td style="width: 4rem;">状态</td> -->
							<td style="width: 4rem;">操作</td>
						</tr>
					</thead>
					<tbody class="tbody" v-if="teachPlanList&&teachPlanList.length>0">
						<tr v-for="(item,index) in teachPlanList" :key="index">
							<td>{{item.classId}}</td>
							<td>周计划</td>
							<td>{{item._useTime}}</td>
							<td>{{item.createTime}}</td>
							<td>{{item.createUserName}}</td>
							<!-- <td>{{item.isPublish}}</td> -->
							<td>
								<!-- <el-button type="text">发布</el-button> -->
								<el-button type="text" @click="queryPlan(item)">查看</el-button>
								<el-button type="text" @click="deleteRow(item)">删除</el-button>
							</td>
						</tr>
					</tbody>
					<tbody class="tbody" v-else>
						<tr>
							<td colspan="7" align="center">暂无数据</td>
						</tr>
					</tbody>
				</table>
			</el-row>
			<el-row>
				<el-pagination
					class="page"
					layout="total, sizes, prev, pager, next, jumper"
					:current-page="searchParam.currPage"
					@size-change="pageSizeChange"
					@current-change="curPageChange"
					:total="searchParam.total"
				></el-pagination>
			</el-row>
		</div>
		
		<el-dialog
		 title="添加计划"
		 :close-on-click-modal="false"
		 :visible.sync="addPlanPopup.visible"
		 width="80%">
			<addPlan ref="addPlan" @cancle="visiblePlanPopup(false)" @success="addPlanCallback"></addPlan>
		</el-dialog>
	</div>
</template>

<script>
	import addPlan from './plan_add_plan'
	import weekPicker from '@keer/components/common/week_picker'
	let vm;
	export default{
		components:{addPlan,weekPicker},
		data(){
			return {
				orgId:'',
				selectWeekTime:[],
				searchParam:{
					campusId:this.$store.state.campusId,
					currPage:1,
					pageSize:10,
					total:0,
					schoolYearId:'',
					planStartTime:'',
					planEndTime:'',
					className:''
				},
				teachPlanList:[],
				addPlanPopup:{
					visible:false,
				},
			}
		},
		methods:{
			init() {
				let time=this.selectWeekTime;
				this.searchParam.planStartTime=time[0];
				this.searchParam.planEndTime=time[1];
				this.search(1);

			},
			campusChange : function(campusId) { //校区改变
				this.searchParam.campusId=campusId;
				this.init();
			},
			/**搜索 */
			search(pgIndex){
				this.searchParam.currPage=pgIndex||this.searchParam.currPage;
				api.teachPlanGetPage(this.searchParam)
				.then(function(data){
					if(data.resultCode==2000){
						vm.searchParam.total=data.totalCount;
						vm.teachPlanList=data.list;

						vm.teachPlanList.forEach(ele=>{
							ele._useTime=ele.planStartTime.substr(0,10)+' 至 '+
							ele.planEndTime.substr(0,10);

						});
					}
				});
			},
			pageSizeChange(val){
				this.searchParam.pageSize = val;
      			this.search(1);
			},
			curPageChange(val){
				this.search(val);
			},

			/**删除行 */
			deleteRow(idata) {
				this.$confirm("此操作将删除该教学计划, 是否继续?", "温馨提示", {
					confirmButtonText: "确定",
					cancelButtonText: "取消",
					type: "warning",
					center: true
				})
				.then(() => {
					api.teachPlanDelete({planId:idata.planId})
					.then(function(data){
						if(data.resultCode==2000){
							vm.$message({
								type:'success',
								message:'删除成功！'
							})
							vm.search(1);
						}
						else{
							vm.$message({
								type:'warning',
								message:data.message||'操作失败'
							})
						}
					});
				})
				.catch(() => {});
				
			},
			addPlanCallback(){
				this.search(1);
				this.visiblePlanPopup(false);
			},
			/**查看 */
			queryPlan(idata){
				api.teachPlanInfo({planId:idata.planId})
				.then(function(data){
					if(data.resultCode==2000){
						vm.visiblePlanPopup(true,0,data.info)
					}
					else{
						vm.$message({
							type:'warning',
							message:data.message
						})
					}
				})
			},
			pickTime(data){
				let startTime=data[0];
				let endTime=data[1];
				this.searchParam.planStartTime=startTime;
				this.searchParam.planEndTime=endTime;
			},
			/**新增查看弹窗 */
			visiblePlanPopup(visible,isEdite=1,data=null){
				this.addPlanPopup.visible=visible;
				if(visible){
					if(this.$refs['addPlan']){
						this.$refs['addPlan'].init({
							orgId:vm.orgId,
							campusId:vm.searchParam.campusId,
							isEdite:isEdite,
							data:data
						});
					}
					else{
						this.$nextTick(()=>{
							this.$refs['addPlan'].init({
								orgId:vm.orgId,
								campusId:vm.searchParam.campusId,
								isEdite:isEdite,
								data:data
							});
						})
					}
				}
			}
		},
		mounted(){
			vm=this;
			let userInfo = tool.getItem(lsKey.user, true); //得到当前用户信息
			this.orgId=userInfo.orgId;
			this.init();
		},
		computed:{
			
		},
		watch:{

		}
	}
</script>

<style lang="scss" scoped>
	


	/*自定义滚动条样式*/
	// .box-tasks::-webkit-scrollbar {
	// 	// height: 0.08rem;
	// 	width: 0.05rem;
	// }
	// .box-tasks::-webkit-scrollbar-thumb {
	// 	border-radius: 0.5rem;
	// 	background: #BBBBBB;
	// }
	// .box-tasks::-webkit-scrollbar-track {
	// 	background: rgba(242, 246, 252, 0);
	// }	

	
</style>
<style scoped src="@/style/module/table.css"></style>